<template>
    <a-form :model="state" @finish="handleFinish">
      <a-form-item label="用户名" name="username" :rules="[{ required: true, message: '请输入用户名' }]">
        <a-input v-model:value="state.username" />
      </a-form-item>
      <a-form-item label="密码" name="password" :rules="[{ required: true, message: '请输入密码' }]">
        <a-input type="password" v-model:value="state.password" />
      </a-form-item>
      <a-form-item>
        <a-button type="primary" html-type="submit">登录</a-button>
      </a-form-item>
    </a-form>
  </template>
  
  <script setup>
  import { reactive } from 'vue'
  import { useRouter } from 'vue-router'
  
  const state = reactive({
    username: '123',
    password: '123',
  })
  const router = useRouter()
  
  function handleFinish() {
    console.log('1')
    // 模拟登录成功
    const loggedIn = true // 根据实际登录逻辑设置登录状态
    if (loggedIn) {
      // 登录成功，跳转到首页
      console.log('2',router)
      router.push('/home')
    } else {
      // 登录失败，可以做一些处理，比如提示用户登录失败
      console.log('登录失败')
    }
  }
  </script>
  